<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计数器与按钮控制</title>
</head>
<style>
    #app {
        padding: 20px;
        background-color: #f8f9fa;
        border: 1px solid #dee2e6;
        width: 300px;
        text-align: center;
    }

    button {
        padding: 10px 20px;
        background-color: #007bff;
        color: white;
        border: none;
        cursor: pointer;
        margin: 10px;
    }

    span {
        font-size: 24px;
        font-weight: bold;
        padding: 10px 20px;
        background-color: #e9ecef;
        border: 1px solid #dee2e6;
    }
</style>
<body>
<div id="app" style="margin: auto">
    <button >减少</button>
    <span></span>
    <button >增加</button>
</div>
    <script src="../../js/vue.js"></script>
<script>
    /*
        使用Vue完成下面的需求：
                当点击减少按钮的时候，页面的数字-1，如果为0，则不能继续减。
                当点击增加按钮的时候，页面的数字+1

     */
    new Vue({
            el: "#app",
            data: {

            },
            methods: {

            }
    });
</script>
</body>
</html>